<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>订单列表</title>
	<link rel="stylesheet" href="__PROXY_PATH__/component/pear/css/pear.css" />
	<style>
		.expand.pear-btn:hover {
			color: currentColor;
			background: none;
		}
		.expand.pear-btn {
			border: 1px solid rgba(255, 255, 255, 0)
		}
	</style>
</head>
<body class="pear-container">
<div class="layui-card">
<!--	&lt;!&ndash;暂时的数据统计&ndash;&gt;-->
<!--	<div class="layui-card-body">-->
<!--		<div class="layui-collapse like-layui-collapse" lay-accordion="" style="border:1px dashed #c4c4c4">-->
<!--			<div class="layui-colla-item">-->
<!--				<h2 class="layui-colla-title like-layui-colla-title" style="background-color: #fff">数据统计</h2>-->
<!--				<div class="layui-colla-content layui-show">-->
<!--					<p>*平台总流水为{$money['all']}元  其中技师分成{$money['all_techn']}元  车费为{$money['all_car']}元</p>-->
<!--					<p>*平台上月流水为{$money['month']}元  其中技师分成{$money['month_techn']}元  车费为{$money['month_car']}元</p>-->
<!--					<p>*平台昨日流水为{$money['day']}元  其中技师分成{$money['day_techn']}元  车费为{$money['day_car']}元</p>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--	</div>-->
	<div class="layui-card-body">
		<form class="layui-form" action="">
			<div class="layui-form-item">

				<div class="layui-inline">
					<label class="layui-form-label">订单号</label>
					<div class="layui-input-inline">
						<input type="text" name="order_no" placeholder="" class="layui-input">
					</div>
				</div>
				<label class="layui-form-label">技师名称</label>
				<div class="layui-input-inline">
					<input type="text" name="real_name" placeholder="" class="layui-input">
				</div>
				<div class="layui-inline">
					<label class="layui-form-label">技师昵称</label>
					<div class="layui-input-inline">
						<input type="text" name="nickname" placeholder="" class="layui-input">
					</div>
				</div>

				<div class="layui-inline">
					<label class="layui-form-label">下单手机号</label>
					<div class="layui-input-inline">
						<input type="text" name="mobile" placeholder="" class="layui-input">
					</div>
				</div>
				<div class="layui-inline">
					<label class="layui-form-label">下单时间：</label>
					<div class="layui-inline" style="margin-right:0;">
						<div class="layui-input-inline" >
							<input type="text" id="expire_start_time" name="expire_start_time" autocomplete="off" class="layui-input">
						</div>
					</div>
					<div class="layui-inline"> - </div>
					<div class="layui-inline" style="margin-right:0;">
						<div class="layui-input-inline" style="margin-right:0;">
							<input type="text" id="expire_end_time" name="expire_end_time" autocomplete="off" class="layui-input">
						</div>
					</div>
				</div>
				<div class="layui-inline">
					<label class="layui-form-label">状态</label>
					<div class="layui-input-inline">
						<select name="status">
							<option value="">----</option>
							<option value="0">待支付</option>
							<option value="1">已支付</option>
							<option value="2">待出发</option>
							<option value="3">已出发</option>
							<option value="4">已到达</option>
							<option value="5">已开始服务</option>
							<option value="6">已完成</option>
							<option value="7">已取消</option>
							<option value="8">已关闭</option>
							<option value="9">客户待补单</option>
							<option value="10">完成补单</option>
							<!--									<option value="11">申诉补单</option>-->
							<option value="12">用户退款</option>
							<option value="13">技师退款</option>
							<option value="14">技师拒单</option>
						</select>
					</div>
				</div>

				<div class="layui-inline" style="margin-left: 50px;">
					<button class="pear-btn pear-btn-md pear-btn-primary" lay-submit lay-filter="search">
						<i class="layui-icon layui-icon-search"></i>
						查询
					</button>
					<button type="reset" class="pear-btn pear-btn-md">
						<i class="layui-icon layui-icon-refresh"></i>
						重置
					</button>
				</div>

			</div>
		</form>
	</div>
</div>

<div class="layui-card">
	<div class="layui-card-body">
		<table id="tableId" lay-filter="tableFilter"></table>
	</div>
</div>

<script src="__PROXY_PATH__/component/layui/layui.js"></script>
<script src="__PROXY_PATH__/component/pear/pear.js"></script>
<script>
	layui.use(['table', 'form', 'jquery','common', 'popup', 'loading'], function() {
		let table = layui.table;
		let form = layui.form;
		let $ = layui.jquery;
		let common = layui.common;
		var popup = layui.popup;
		let loading = layui.loading;
		let laydate = layui.laydate;

		let articleTable = table.render({
			elem: '#tableId',
			method: "post",
			url: "{:url('order/index')}",
			limit: 20,
			page: true,
			even: true,
			skin: 'line',
			toolbar: "#toolbarTpl",
			cols: [[
				{type: "checkbox"},
				{field: "id", title: "ID", width:60, sort: true, align: 'center'},
				{field: "order_no", title: "订单号",width:180,},
				{field: "title", title: "服务项目",width:150,},
				{field: "name", title: "下单人",width:90},
				{field: "mobile", title: "下单手机号",width:120},
				{field: "t_nickname", title: "服务技师",width:90},
				{field: "t_mobile", title: "技师手机号",width:120},
				{field: "add_time", title: "下单时间",width:200},
				{field: "refund_time", title: "退款时间",width:200},
				{field: "service_time", title: "服务时间",width:200,},
				{field: "address", title: "服务地址",width:200,},
				{field: "total_price", title: "订单总价",width:100},
				{field: "refund_price", title: "退款金额",width:100},
				{field: "travel_price", title: "车费"},
				{field: "status", title: "状态", },
				{title: "操作", width:150, align: "center", toolbar: "#operationTpl"}
			]],
			done: function (res, curr, count) {
				console.log(res, curr, count)
			}
		});

		form.on('submit(search)', function(data) {
			articleTable.reload({
				where: data.field,
				page: {curr: 1}
			});
			return false;
		});
		//日期时间范围
		laydate.render({
			elem: '#expire_start_time'
			, type: 'datetime'
			,theme: '#1E9FFF'
		});

		laydate.render({
			elem: '#expire_end_time'
			, type: 'datetime'
			,theme: '#1E9FFF'
		});

		table.on("toolbar(tableFilter)", function (obj) {
			switch (obj.event) {
				case "add":
					add();
					break;
			}
		});
		function add() {
			layer.open({
				type: 2,
				title: '新增',
				shade: 0.5,
				maxmin:true,
				area: [common.isModile() ? '100%' : '90%', common.isModile() ? '100%' : '90%'],
				content: "{:url('saveinfo')}"
			});
		}

		table.on("tool(tableFilter)", function (obj) {
			let data = obj.data;
			switch (obj.event) {
				case "update":
					update(data.save_url);
					break;

				case "del":
					del(data.id);
					break;

				case "view":
					view(data.view_url);
					break;
			}
		});
		function update(view_url) {
			layer.open({
				type: 2,
				title: '修改',
				shade: 0.5,
				maxmin:true,
				area: [common.isModile() ? '100%' : '90%', common.isModile() ? '100%' : '90%'],
				content: view_url
			});
		}

		function view(save_url) {
			layer.open({
				type: 2,
				title: '查看',
				shade: 0.5,
				maxmin:true,
				area: [common.isModile() ? '100%' : '90%', common.isModile() ? '100%' : '90%'],
				content: save_url
			});
		}


		function del(id) {
			layer.confirm('确定要删除吗？', {
				icon: 3,
				title: '提示'
			}, function(index){
				$.ajax({
					url:"{:url('Service/delete')}",
					type:"POST",
					dataType:"JSON",
					data:{
						id:id
					},
					beforeSend: function () {
						loading.Load(1, "");
					},
					complete: function () {
						loading.loadRemove();
						layer.close(index);
					},
					success:function(res)
					{
						if(res.code == 0)
						{
							//正常业务
							popup.success(res.msg, function(){
								location.reload();
								layer.close(index); //再执行关闭
							});
						}else
						{
							//业务异常
							popup.warning(res.msg);
						}
					},
					error:function()
					{
						loading.loadRemove();
						layer.close(index);
						popup.failure('服务器错误');
					}
				});
			});
		}
	});
</script>

<!-- 头工具栏模板 -->
<!--
<script type="text/html" id="toolbarTpl">
    <button class="pear-btn pear-btn-primary pear-btn-md" lay-event="add">
        <i class="layui-icon layui-icon-add-1"></i>
        新增
    </button>
</script>
-->

<!-- 行工具栏模板 -->
<script type="text/html" id="operationTpl">
	<button class="pear-btn pear-btn-primary pear-btn-sm" title="查看" lay-event="view">查看</button>
<!--// 	<button class="pear-btn pear-btn-danger pear-btn-sm" title="删除" lay-event="del"><i class="layui-icon layui-icon-delete"></i></button>-->
</script>

<!--封面图片-->
<script type="text/html" id="templetTpl">
	<img src="{{d.images}}" height="50" />
</script>
<style type="text/css">
	.layui-table-cell{
		height: auto!important;
		white-space: normal;
	}
</style>
</body>
</html>